<template>
  <Dialog v-model="dialogVisible" :title="dialogTitle">
    <el-form
      ref="formRef"
      v-loading="formLoading"
      label-width="80px"
    >

      <el-table :data="tableData" border style="width: 100%">
        <el-table-column prop="createTime" label="时间" width="180" />
        <el-table-column label="类型" align="center" prop="applyState" width="150px" >
          <template #default="scope">
            <dict-tag :type="DICT_TYPE.WEALTH_TYPE" :value="scope.row.iorDecrease" />
          </template>
        </el-table-column>
        <el-table-column prop="wealthValue" label="财富值" />
        <el-table-column prop="remark" label="备注/原因" />
      </el-table>

    </el-form>
    <template #footer>
      <el-button @click="dialogVisible = false">关 闭</el-button>
    </template>
  </Dialog>
</template>
<script lang="ts" setup>
import * as WealthApi from '@/api/hutai/wealth'
import {DICT_TYPE} from "@/utils/dict";
defineOptions({ name: 'WealthRecordForm' })

const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改


const formRef = ref() // 表单 Ref

const tableData = ref([])

/** 打开弹窗 */
const open = async (type: string, id?: number) => {
  dialogVisible.value = true
  dialogTitle.value = t('' + type)
  formType.value = type
  // 修改时，设置数据
  if (id) {
    formLoading.value = true
    try {
      tableData.value = await WealthApi.getWealthRecordList(id);
    } finally {
      formLoading.value = false
    }
  }



}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗

</script>
